<template>
  <!-- 检修方案 -->
  <view class="container">
    <view class="background-white">
      <view class="flex text bor-btm">
        检修开始时间：<text>{{ applyInfo.examineStartTime }}</text>
      </view>
      <view class="flex text bor-btm">
        检修结束时间：<text>{{ applyInfo.examineEndTime }}</text>
      </view>
      <view class="flex text flex-col bor-btm">
        <view class="pb-10">检修质量要求：</view>
        <text>{{ applyInfo.examineQuality }}</text>
      </view>
      <view class="flex text flex-col bor-btm">
        <view class="pb-10">验收标准：</view>
        <text>{{ applyInfo.acceptStandard }}</text>
      </view>
    </view>

    <view v-for="(row, ri) in info.deviceExamineCureList" :key="ri">
      <view class="hidden-title">措施确认{{ ri + 1 }}</view>
      <view class="background-white">
        <view class="flex text bor-btm">
          检修步骤：<text>{{ row.examineStep }}</text>
        </view>
        <view class="flex text flex-col bor-btm">
          <view class="pb-10">安全措施：</view>
          <text>{{ row.measures }}</text>
        </view>
        <view class="flex text bor-btm">
          措施是否落实：<text>{{ ['', '是', '否'][row.stepStatus] }}</text>
        </view>
        <view class="flex text flex-col bor-btm">
          <view class="pb-10">落实情况：</view>
          <text>{{ row.stepInfo }}</text>
        </view>
      </view>
    </view>

    <view class="background-white bor-top">
      <view class="flex text bor-btm">
        工艺交出措施：
        <text class="blue" style="cursor: pointer" @click="download(deliverInfo.technology)">点击查看详情>></text>
      </view>
      <view class="flex text bor-btm">
        人员资质：
        <text class="blue" style="cursor: pointer" @click="download(deliverInfo.staffQualifications)"
          >点击查看详情>></text
        >
      </view>
      <view class="flex text bor-btm">
        备注：<text>{{ deliverInfo.comment }}</text>
      </view>
    </view>

    <view class="background-white bor-top" v-for="item in info.cureWorkflowEntityList || []" :key="item.id">
      <view class="flex text bor-btm">
        确认人意见：<text>{{ opinions[item.opinionType] }}</text>
      </view>
      <view class="flex text bor-btm">
        审查意见说明：<text>{{ item.opinion }}</text>
      </view>
      <view class="flex text bor-btm">
        确认人：<text>{{ item.createUserName }}</text>
      </view>
      <view class="flex text bor-btm">
        确认时间：<text>{{ item.createTime }}</text>
      </view>
    </view>

    <view v-if="info.deviceExamineAnalysisEntityList.length" class="analyse-container">
      <view class="card-wrap" v-for="(item, index) in info.deviceExamineAnalysisEntityList" :key="`analyse-${index}`">
        <view class="content">
          <view class="header-wrap">
            <view class="label">分析时间：</view>
            <view class="title">{{ item.analysisTime }}</view>
          </view>
          <view class="cu-card-wrap">
            <view class="body-wrap">
              <view class="content-wrap">
                <view class="label">分析对象：</view>
                <view class="value">{{ item.analysisTarget }}</view>
              </view>
              <view class="content-wrap">
                <view class="label">分析点：</view>
                <view class="value">{{ item.analysisPoint }}</view>
              </view>
              <view class="content-wrap">
                <view class="label">阈值：</view>
                <view class="value">{{ item.analysisThreshold }}</view>
              </view>
              <view class="content-wrap">
                <view class="label">分析数据(%LEL)：</view>
                <view class="value">{{ item.analysisData }}</view>
              </view>
              <!-- <view class="content-wrap">
								<view class="label">分析结果：</view>
								<view class="value">{{ item.analysisResult }}</view>
							</view> -->
              <view class="content-wrap">
                <view class="label">分析人签字：</view>
                <view class="value">{{ item.analysisUserName }}</view>
              </view>
            </view>
          </view>
        </view>
      </view>
    </view>

    <view class="background-white bor-top">
      <uni-table ref="table" border stripe emptyText="暂无更多数据">
        <uni-tr>
          <uni-th width="50" align="center">序号</uni-th>
          <uni-th width="130" align="center">作业票证类型</uni-th>
          <uni-th width="80" align="center">票证编号</uni-th>
        </uni-tr>
        <uni-tr v-for="(item, index) in info.deviceExamineBillEntityList" :key="index">
          <uni-td>{{ index + 1 }}</uni-td>
          <uni-td>{{ item.billTypeLabel }}</uni-td>
          <uni-td>{{ item.billCode }}</uni-td>
        </uni-tr>
      </uni-table>
    </view>

    <view class="background-white bor-top">
      <uni-table ref="table" border stripe emptyText="暂无更多数据">
        <uni-tr>
          <uni-th width="50" align="center">序号</uni-th>
          <uni-th width="120" align="center">培训教育</uni-th>
          <uni-th width="60" align="center">培训人员</uni-th>
          <uni-th width="60" align="center">接收教育人员</uni-th>
        </uni-tr>
        <uni-tr v-for="(item, index) in info.deviceExamineTrainEntityList" :key="index">
          <uni-td>{{ index + 1 }}</uni-td>
          <uni-td>{{ item.trainMatter }}</uni-td>
          <uni-td>{{ item.trainer }}</uni-td>
          <uni-td>{{ item.trainReceiveNameLabel }}</uni-td>
        </uni-tr>
      </uni-table>
    </view>
    <view class="background-white bor-top">
      <uni-table ref="table" border stripe emptyText="暂无更多数据">
        <uni-tr>
          <uni-th width="50" align="center">序号</uni-th>
          <uni-th width="120" align="center">劳动防护用品</uni-th>
          <uni-th width="60" align="center">数量说明</uni-th>
          <uni-th width="60" align="center">分配人</uni-th>
        </uni-tr>
        <uni-tr v-for="(item, index) in info.deviceExamineItemEntityList" :key="index">
          <uni-td>{{ index + 1 }}</uni-td>
          <uni-td>{{ item.item }}</uni-td>
          <uni-td>{{ item.itemNum }}</uni-td>
          <uni-td>{{ item.createUserName }}</uni-td>
        </uni-tr>
      </uni-table>
    </view>
  </view>
</template>

<script>
import config from '@/config.js'

export default {
  props: {
    info: {
      type: Object
    }
  },
  data() {
    return {
      opinions: { PASS: '通过', REPULSE: '退回' },
      applyInfo: {},
      deliverInfo: {}
    }
  },
  watch: {
    info(n, o) {
      ;(this.applyInfo = n.applyInfo ? n.applyInfo : {}), (this.deliverInfo = n.deliverInfo ? n.deliverInfo : {})
    }
  },
  mounted() {
    console.log('info', this.info)
    ;(this.applyInfo = this.info.applyInfo ? this.info.applyInfo : {}),
      (this.deliverInfo = this.info.deliverInfo ? this.info.deliverInfo : {})
  },
  methods: {
    download(link) {
      console.log('link', link)
      uni.downloadFile({
        url: config.staticUrl + link,
        success(data) {
          console.log('下载成功：', data)
          if (data.statusCode === 200) {
            // uni.openDocument({
            // 	filePath: data.tempFilePath,
            // 	success() {
            // 		console.log('xiazaichenggong')
            // 	}
            // })
            uni.saveFile({
              tempFilePath: data.tempFilePath,
              success() {
                console.log('savedFilePath' + res.savedFilePath)
                uni.showToast({
                  title: '保存成功',
                  duration: 1000
                })
              }
            })
          }
        }
      })
      // if (!link) {
      // 	return
      // }
      // const pos = link.lastIndexOf('/')
      // const pos2 = link.lastIndexOf('?')
      // let filename = link.substring(pos + 1)
      // if (pos2 > -1) {
      // 	filename = link.substring(pos + 1, pos2)
      // }
      // FileSaver.saveAs(link, filename)
    }
  }
}
</script>

<style lang="scss" scoped>
.container .background-white .bor-btm {
  align-items: baseline;
}
</style>
<style lang="scss" scoped>
.container {
  .background-white {
    background-color: #fff;
    padding: 20rpx 30rpx;
    box-sizing: border-box;

    .uni-forms-item__label {
      color: #333;
      font-size: 30rpx;
    }

    .bor-btm {
      display: flex;
      border-bottom: 1px solid #d5d7e3;
    }

    .analysis-box {
      box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.2);
      border-radius: 10rpx;
      color: #666;
      .analysis-title {
        background: #f1f6f9;
        padding: 20rpx;
        text:nth-child(1) {
          font-weight: 700;
          color: #333;
        }
        text:nth-child(2) {
          color: #999;
        }
      }
      .analysis-text {
        view:nth-child(1) {
          text-align: right;
          width: 26%;
          color: #999;
        }
        view:nth-child(2) {
          width: 74%;
        }
      }
    }

    .text {
      padding-bottom: 20rpx;
      padding-top: 4rpx;
      color: #333;

      text {
        color: #666;
      }

      .blue {
        color: #88b4c4;
      }
    }
  }
}

.hidden-title {
  background: #f5f5f5;
  padding: 20rpx;
  color: #999;
}

.bor-top {
  border-top: 20rpx solid #f5f5f5;
}

.submit-group {
  background: #fff;
  z-index: 9;
  padding: 30px;
}

.u-button {
  width: 600rpx;
}
</style>
<style scoped lang="scss">
// @import '../style/style.scss';
.analyse-container {
  background: #fff;
  padding-bottom: 50rpx;
  margin-bottom: 24rpx;
}
.cu-card-wrap {
  margin: 0;
}
.card-wrap {
  position: relative;
  padding: 40rpx 20rpx 0 20rpx;
  .content {
    flex: 1;
    box-shadow: 0rpx 4rpx 10rpx 1rpx rgba(204, 204, 204, 0.5);
    border-radius: 10rpx;
    position: relative;
    .bottom-action {
      background: #f1f6f9;
      height: 80rpx;
      display: flex;
      align-items: center;
      justify-content: flex-end;
      padding: 0 24rpx;
      .button {
        height: 58rpx;
        line-height: 58rpx;
        background: #e3e4eb;
        border-radius: 39rpx;
        font-size: 28rpx;
        color: #454a5e;
        padding: 0 30rpx;
      }
    }
    .header-wrap {
      background: #f1f6f9;
      display: flex;
      align-items: center;
      justify-content: space-between;
      line-height: 40rpx;
      padding: 20rpx 30rpx;

      .title {
        font-size: 30rpx;
        font-weight: 800;
        color: #333333;
      }

      .time {
        font-size: 26rpx;
        color: #999999;
      }
    }
  }
}
</style>
